<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">
<head th:replace="common/head::head">
</head>

<body>
<div class="layui-container">
    <form action="./save.json" class="layui-form" id="form">
        <div class="layui-form-item">
            <label class="layui-form-label">角色名</label>
            <div class="layui-input-block">
                <input type="text" name="name" placeholder="输入角色名" required lay-verify="required"
                       class="layui-input" th:value="${item?.name}">
                <input name="id" type="hidden" th:value="${item?.id}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">权限</label>
            <div class="layui-input-block" id="tree">

            </div>
        </div>
        <div class="layui-form-item" style="padding-left: 20%;margin-top: 20px;">
            <button class="layui-btn layui-btn-normal" lay-submit lay-filter="submit">提交
            </button>
        </div>
    </form>
</div>
</body>

<script type="text/javascript">
    var id = getQueryString("id");
    var tree;

    function loadSuccess() {
        layui.use('tree', function () {
            tree = layui.tree;
            loadingAjax({
                url: './getFeature.json',
                data: {
                    id: id,
                },
                success: function (data) {
                    if (data.code !== 200) {
                        layer.msg(data.msg);
                        return;
                    }
                    tree.render({
                        elem: '#tree',
                        data: data.data,
                        id: "tree",
                        showCheckbox: true,
                        click: function (obj) {
                        }
                    });
                }
            });
        });
        //
        form.on('submit(submit)', function (data) {
            var checkData = tree.getChecked("tree");
            if (!checkData || checkData.length <= 0) {
                layer.msg("请勾选权限");
                return false;
            }
            var field = data.field;
            field.feature = JSON.stringify(checkData);
            loadingAjax({
                url: data.form.action,
                data: field,
                success: function (data) {
                    layer.msg(data.msg);
                    if (200 === data.code) {
                        autoClose();
                    }
                }
            });
            return false;
        });
    }

</script>
</html>